<template>
    <div class="hole">
       <div class="index-top">
           <img class="image" src="../../assets/image/sp.png" alt="">
           <p class="tips">
<!--             欢迎！请按照以下步骤操作.得到确认-->
               {{$t('h.A115')}}
           </p>
       </div>
        <div class="index-tips-first">
            <div class="card">
<!--              步骤一：提供文件和信息-->
                <p class="title">  {{$t('h.A116')}}</p>
                <p class="content">
<!--                  我们需要收集相关信息，包括您的企业和业务代表的身份信息。按照我们的说明安全地上传您的文档信息-->
                    {{$t('h.A117')}}
                </p>
            </div>
            <div class="card">
<!--              步骤二：等待审核-->
                <p class="title">  {{$t('h.A118')}}</p>
                <p class="content">
<!--                  我们将在2-48小时内审查你的提交信息，你可以继续访问此页面查看您的审核状态，审核完成后将直接进入店铺中心！-->
                    {{$t('h.A119')}}
                </p>
            </div>
            <div class="card">
<!--              步骤三：开始销售-->
                <p class="title">  {{$t('h.A120')}}</p>
                <p class="content">
<!--                确认完成后，您可以在商品中心选择你将要新增加的商品，我们将在第-->
                    {{$t('h.A121')}}
                </p>
            </div>
        </div>
        <div class="index-tips-second">
            <div class="top-index">
<!--              信息受保护-->
                <span><van-icon name="shield-o" />    {{$t('h.A122')}}</span>
            </div>
            <div class="tips-content">
<!--              我们验证团队将卖家和卖家的数据隐私和安全放在首位，我们签订了严格的保密协议-->
                {{$t('h.A123')}}
            </div>
            <div class="button">
                <van-button size="small" @click="routerNext('/merchant')" color="#002FFF" block>
<!--                  开始-->
                  {{$t('h.A124')}}</van-button>
                <p class="id-tips">
<!--                  如果您不需要注册，您可以-->
                    {{$t('h.A125')}} <a @click="routerNext('/mine')" href="javascript:void (0)">
<!--                  返回-->
                  {{$t('h.A126')}}</a>
                </p>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "index",
        methods:{
            routerNext(item){
                this.$router.push(item).catch(err=>{})
            }
        }
    }
</script>

<style scoped lang="scss">
    .hole{
        width: 100%;
        min-height: 100vh;
        background: #f8f8f8;
        .index-top{
            width: 100%;
            padding: 15px 0;
            min-height: 150px;
            text-align: center;
            background: #fff;
            .image{
                height: 100px;
            }
            .tips{
                width: 100%;
                padding: 0 12%;
                box-sizing: border-box;
                font-size: 22px;
            }
        }
        .index-tips-first{
            width: 100%;
            margin-top: 10px;
            min-height: 150px;
            background: #fff;
            padding: 3%;
            box-sizing: border-box;
            .card{
                width: 100%;
                min-height: 100px;
                .title{
                    width: 100%;
                    font-size: 18px;
                    font-weight: 600;
                }
                .content{
                    margin-top: 10px;
                    width: 100%;
                    font-size: 12px;
                    color: #999;
                }
            }
        }
        .index-tips-second{
            margin-top: 10px;
            width: 100%;
            min-height: 150px;
            background: #fff;
            margin-bottom: 50px;
            padding: 3%;
            box-sizing: border-box;
            .top-index{
                width: 100%;
                height: 30px;
                display: flex;
                span{
                    display: flex;
                    padding: 5px 15px;
                    background: rgba(136,193,250,0.6);
                    justify-content: center;
                    align-items: center;
                    font-size: 10px;
                    color: #002FFF;
                    min-width: 60px;
                    border-radius: 15px;
                }
            }
            .tips-content{
                width: 100%;
                padding: 10px 0;
                box-sizing: border-box;
                margin-top: 10px;
                min-height: 50px;
                font-size: 12px;
                line-height: 24px;
            }
            .button{
                width: 100%;
                margin-top: 30px;
                .id-tips{
                    width: 100%;
                    margin-top: 10px;
                    font-size: 10px;
                    text-align: center;
                    a{
                        color: #002FFF;
                    }
                }
            }
        }
    }

</style>
